﻿<UserControl 
  x:Class="HeritageAcademy.Library.Controls.LibraryView"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:c="clr-namespace:HeritageAcademy.Library.Controls"
  xmlns:d="clr-namespace:HeritageAcademy.Models.Filters;assembly=HeritageAcademy.Models"
  xmlns:vm="clr-namespace:HeritageAcademy.Models.ViewModels;assembly=HeritageAcademy.Models"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
  xmlns:Controls="clr-namespace:HeritageAcademy.Library.Controls" 
  mc:Ignorable="d1" 
  xmlns:d1="http://schemas.microsoft.com/expression/blend/2008" 
  xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
  d1:DesignWidth="1180">
    <UserControl.Resources>
        <Storyboard x:Key="Exit">
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="Breadcrumb" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)">
                <SplineDoubleKeyFrame KeySpline="0.8,0,1,1" KeyTime="00:00:00.4000000" Value="-800"/>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00.2" Storyboard.TargetName="FiltersGrid" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)">
                <SplineDoubleKeyFrame KeySpline="0.8,0,1,1" KeyTime="00:00:00.4000000" Value="-800"/>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00.6" Storyboard.TargetName="BookList" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)">
                <SplineDoubleKeyFrame KeySpline="0.8,0,1,1" KeyTime="00:00:00.4000000" Value="500"/>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00.6" Storyboard.TargetName="BookBackground" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)">
                <SplineDoubleKeyFrame KeySpline="0.8,0,1,1" KeyTime="00:00:00.4000000" Value="200"/>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:01.0" Storyboard.TargetName="OuterGrid" Storyboard.TargetProperty="Opacity">
                <SplineDoubleKeyFrame KeyTime="00:00:00.1" Value="0"/>
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>
        <Storyboard x:Key="Enter" BeginTime="00:00:00.1">
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="FiltersGrid" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)">
                <SplineDoubleKeyFrame KeySpline="0.8,0,1,1" KeyTime="00:00:00.0000000" Value="0"/>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="Breadcrumb" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)">
                <SplineDoubleKeyFrame KeySpline="0.8,0,1,1" KeyTime="00:00:00.0000000" Value="0"/>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="BookList" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)">
                <SplineDoubleKeyFrame KeyTime="00:00:00.0000000" Value="0"/>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="BookBackground" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)">
                <SplineDoubleKeyFrame KeyTime="00:00:00.0000000" Value="0"/>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="OuterGrid" Storyboard.TargetProperty="Opacity">
                <SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
                <SplineDoubleKeyFrame KeyTime="00:00:00.4" Value="1.0"/>
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>

        <Style TargetType="{x:Type ScrollViewer}">
            <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type ScrollViewer}">
                        <Grid x:Name="Grid" Background="Transparent">
                            <Grid.RowDefinitions>
                                <RowDefinition Height="36"/>
                                <RowDefinition Height="*"/>
                                <RowDefinition Height="10"/>
                            </Grid.RowDefinitions>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition Width="Auto"/>
                            </Grid.ColumnDefinitions>
                            <ScrollContentPresenter Grid.RowSpan="3" x:Name="PART_ScrollContentPresenter" Margin="0,0,4,0" CanHorizontallyScroll="False" CanVerticallyScroll="False"/>
                            <ScrollBar Grid.Row="1" x:Name="PART_VerticalScrollBar" Margin="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(BookshelfRowThickness)}" Grid.Column="1" AutomationProperties.AutomationId="VerticalScrollBar" Maximum="{TemplateBinding ScrollableHeight}" Minimum="0" Value="{Binding Path=VerticalOffset, Mode=OneWay, RelativeSource={RelativeSource TemplatedParent}}" ViewportSize="{TemplateBinding ViewportHeight}" Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}" />
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <Style x:Key="UnderlineButton" TargetType="Button" >
            <Setter Property="OverridesDefaultStyle" Value="True" />
            <Setter Property="SnapsToDevicePixels" Value="True" />
            <Setter Property="FocusVisualStyle" Value="{x:Null}" />
            <Setter Property="Padding" Value="0,1,0,0" />
            <Setter Property="Cursor" Value="Hand" />
            <Setter Property="Foreground" Value="{StaticResource StandardForegroundBrush}" />
            <Setter Property="MinHeight" Value="32" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Border Background="Transparent">
                            <Border x:Name="Border" BorderThickness="0,0,0,3" BorderBrush="{StaticResource TransparentSelectionBrush}" HorizontalAlignment="Left">
                                <ContentPresenter HorizontalAlignment="Left" VerticalAlignment="Center" Margin="{TemplateBinding Padding}" />
                            </Border>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Trigger.EnterActions>
                                    <BeginStoryboard>
                                        <Storyboard>
                                            <ColorAnimation Storyboard.TargetName="Border" Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)" To="{StaticResource SelectionColor}" Duration="00:00:00.1" />
                                        </Storyboard>
                                    </BeginStoryboard>
                                </Trigger.EnterActions>
                                <Trigger.ExitActions>
                                    <BeginStoryboard>
                                        <Storyboard>
                                            <ColorAnimation Storyboard.TargetName="Border" Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)" Duration="00:00:00.1" />
                                        </Storyboard>
                                    </BeginStoryboard>
                                </Trigger.ExitActions>
                            </Trigger>
                            <Trigger Property="IsFocused" Value="True">
                                <Setter Property="Foreground" Value="{DynamicResource SelectionBrush}" />
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

    </UserControl.Resources>
    <Grid x:Name="OuterGrid">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
            <RowDefinition Height="Auto" x:Name="BookshelfRow" />
        </Grid.RowDefinitions>

        <ItemsControl x:Name="Breadcrumb" Margin="30,15,30,0" Foreground="{DynamicResource SelectionBrush}" FontFamily="Cambria" FontSize="20px" ItemsSource="{Binding FilterStack}" FocusVisualStyle="{x:Null}" Focusable="False" TextOptions.TextFormattingMode="Display">
            <ItemsControl.RenderTransform>
                <TransformGroup>
                    <ScaleTransform/>
                    <SkewTransform/>
                    <RotateTransform/>
                    <TranslateTransform/>
                </TransformGroup>
            </ItemsControl.RenderTransform>
            <ItemsControl.Template>
                <ControlTemplate TargetType="ItemsControl">
                    <WrapPanel Orientation="Horizontal" IsItemsHost="True" />
                </ControlTemplate>
            </ItemsControl.Template>
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal">
                        <Border x:Name="Divider" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="14,0,10,0">
                            <Controls:Bitmap Source="..\..\Images\divider.png" />
                        </Border>
                        <Button x:Name="BreadcrumbButton" Style="{StaticResource UnderlineButton}" Content="{Binding}" VerticalAlignment="Center" Click="FilterButton_Click" Foreground="{DynamicResource SelectionBrush}" />
                    </StackPanel>
                    <DataTemplate.Triggers>
                        <DataTrigger Binding="{Binding HasSubFilters}" Value="False">
                            <Setter Property="IsEnabled" Value="False" />
                        </DataTrigger>
                        <DataTrigger Binding="{Binding IsLastInStack}" Value="True">
                            <Setter Property="IsEnabled" Value="False" />
                        </DataTrigger>
                        <DataTrigger Binding="{Binding IsFirstInStack}" Value="True">
                            <Setter TargetName="Divider" Property="Visibility" Value="Collapsed" />
                        </DataTrigger>
                    </DataTemplate.Triggers>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
            <ItemsControl.ItemContainerStyle>
                <Style TargetType="ContentPresenter">
                    <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
                </Style>
            </ItemsControl.ItemContainerStyle>
        </ItemsControl>

        <Grid x:Name="FiltersGrid" Grid.Row="1" Margin="30,15,0,30">

            <Grid.RowDefinitions>
                <RowDefinition Height="*" />
                <RowDefinition Height="Auto" />
            </Grid.RowDefinitions>
            <Grid.RenderTransform>
                <TransformGroup>
                    <ScaleTransform/>
                    <SkewTransform/>
                    <RotateTransform/>
                    <TranslateTransform/>
                </TransformGroup>
            </Grid.RenderTransform>
            <Controls:PagingDecorator x:Name="Pager" >
                <ListBox x:Name="FiltersList" Focusable="False" ItemsSource="{Binding DisplayResults}" FontFamily="Cambria" FontSize="22px" KeyboardNavigation.ControlTabNavigation="None" KeyboardNavigation.DirectionalNavigation="Cycle" KeyboardNavigation.TabNavigation="None" SelectedItem="{Binding HighlightedCourse, Mode=TwoWay}" >
                    <ListBox.Template>
                        <ControlTemplate TargetType="ItemsControl">
                            <Controls:SmartColumnsPanel IsItemsHost="True" AvailableWidth="{Binding ElementName=FiltersGrid, Path=ActualWidth}" HorizontalAlignment="Left" MinimumColumnWidth="300" />
                        </ControlTemplate>
                    </ListBox.Template>
                    <ListBox.ItemContainerStyle>
                        <Style TargetType="ListBoxItem">
                            <Setter Property="OverridesDefaultStyle" Value="True" />
                            <Setter Property="Margin" Value="0,0,30,0" />
                            <Setter Property="FocusVisualStyle" Value="{x:Null}" />
                            <Setter Property="Template">
                                <Setter.Value>
                                    <ControlTemplate TargetType="ListBoxItem">
                                        <ContentPresenter />
                                    </ControlTemplate>
                                </Setter.Value>
                            </Setter>
                        </Style>
                    </ListBox.ItemContainerStyle>
                    <ListBox.ItemTemplate>
                        <DataTemplate>
                            <DataTemplate.Resources>
                                <DataTemplate DataType="{x:Type d:CourseFilter}" >
                                    <TextBlock Text="{Binding DisplayText}" Margin="0,6,0,3" TextWrapping="Wrap" />
                                </DataTemplate>
                                <DataTemplate DataType="{x:Type vm:CourseViewModel}" >
                                    <StackPanel Margin="0,6,0,3">
                                        <TextBlock Text="{Binding Model.Title}" TextWrapping="Wrap" />
                                        <TextBlock Text="{Binding Model.Creator, StringFormat='by {0}'}" FontFamily="{StaticResource PrimaryFontFamily}" FontSize="12" FontWeight="Light" TextWrapping="Wrap" />
                                    </StackPanel>
                                </DataTemplate>
                            </DataTemplate.Resources>
                            <Button x:Name="FilterButton" Click="FilterButton_Click" Style="{StaticResource UnderlineButton}" Content="{Binding .}" MouseEnter="FilterButton_MouseEnter" MouseLeave="FilterButton_MouseLeave"  />
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                </ListBox>
            </Controls:PagingDecorator>

            <Grid Grid.Row="1" >

                <ListBox x:Name="PagingListBox" Style="{DynamicResource PagingListBox}" VerticalAlignment="Center" HorizontalAlignment="Center" ItemsSource="{Binding ElementName=Pager, Path=PageCollection}"  SelectedIndex="{Binding ElementName=Pager, Path=CurrentPage, Mode=TwoWay}" >
                    <ListBox.ItemTemplate>
                        <DataTemplate>
                            <TextBlock Text="{Binding PageNumber}" />
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                    
                </ListBox>
                   
            </Grid>

        </Grid>

        <Grid x:Name="BookBackground" VerticalAlignment="Bottom" Grid.ColumnSpan="3" Grid.Row="2"  >
            <Grid.RenderTransform>
                <TransformGroup>
                    <ScaleTransform/>
                    <SkewTransform/>
                    <RotateTransform/>
                    <TranslateTransform/>
                </TransformGroup>
            </Grid.RenderTransform>
            <Border VerticalAlignment="Bottom" Margin="0,0,0,75" Height="210">
                <Border.Background>
                    <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                        <GradientStop Color="#00FFFFFF" Offset="0"/>
                        <GradientStop Color="#38000000" Offset="1"/>
                    </LinearGradientBrush>
                </Border.Background>
            </Border>

            <Border VerticalAlignment="Bottom" Height="80" Grid.ColumnSpan="3" Grid.Row="2" >
                <Border.Background>
                    <ImageBrush ImageSource="..\..\Images\wood.png" Stretch="UniformToFill" AlignmentX="Center" AlignmentY="Top" />
                </Border.Background>
            </Border>
        </Grid>

        <Controls:AnimatedScrollDecorator x:Name="BookList" Grid.Row="2" Margin="0,0,0,0" VerticalAlignment="Bottom" IsAnimationEnabled="True" Easing="0,0.25,0.25,1" ClipToBounds="True" >
            <Controls:AnimatedScrollDecorator.RenderTransform>
                <TransformGroup>
                    <ScaleTransform/>
                    <SkewTransform/>
                    <RotateTransform/>
                    <TranslateTransform/>
                </TransformGroup>
            </Controls:AnimatedScrollDecorator.RenderTransform>

            <Controls:AdorningListBox x:Name="BookItems" ItemsSource="{Binding Courses}"  Duration="00:00:00.3" SelectedItem="{Binding HighlightedCourse, Mode=TwoWay}" >
                <Controls:AdorningListBox.Template>
                    <ControlTemplate TargetType="Controls:AdorningListBox">
                        <Grid>
                            <StackPanel x:Name="BookListPanel" IsItemsHost="True" Orientation="Horizontal" />
                            <Border x:Name="Adorner" HorizontalAlignment="Left" Height="6" Width="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=SelectedElementWidth}" VerticalAlignment="Bottom" Background="{DynamicResource SelectionBrush}" >
                                <Border.Effect>
                                    <DropShadowEffect Direction="-90" ShadowDepth="2" BlurRadius="5"  />
                                </Border.Effect>
                                <Border.RenderTransform>
                                    <TranslateTransform X="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=SelectedElementOffsetX}" Y="-25" />
                                </Border.RenderTransform>
                            </Border>
                        </Grid>
                        <ControlTemplate.Triggers>
                            <Trigger Property="AdorningElementOpacity" Value="1">
                                <Trigger.EnterActions>
                                    <BeginStoryboard>
                                        <Storyboard>
                                            <DoubleAnimation Storyboard.TargetName="Adorner" Storyboard.TargetProperty="Opacity" To="1.0" Duration="00:00:00.2" />
                                        </Storyboard>
                                    </BeginStoryboard>
                                </Trigger.EnterActions>
                                <Trigger.ExitActions>
                                    <BeginStoryboard>
                                        <Storyboard BeginTime="00:00:00.2">
                                            <DoubleAnimation Storyboard.TargetName="Adorner" Storyboard.TargetProperty="Opacity" To="0.0" Duration="00:00:00.4" />
                                        </Storyboard>
                                    </BeginStoryboard>
                                </Trigger.ExitActions>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Controls:AdorningListBox.Template>
                <Controls:AdorningListBox.ItemTemplate>
                    <DataTemplate>
                        <Controls:LibraryBookView IsFiltered="{Binding IsFiltered}" Cursor="Hand" MouseLeftButtonUp="LibraryBookView_MouseLeftButtonDown" />
                    </DataTemplate>
                </Controls:AdorningListBox.ItemTemplate>
                <Controls:AdorningListBox.ItemContainerStyle>
                    <Style TargetType="ListBoxItem">
                        <Setter Property="OverridesDefaultStyle" Value="True" />
                        <Setter Property="FocusVisualStyle" Value="{x:Null}" />
                        <Setter Property="VerticalAlignment" Value="Bottom" />
                        <Setter Property="Template">
                            <Setter.Value>
                                <ControlTemplate TargetType="ListBoxItem">
                                    <ContentPresenter />
                                </ControlTemplate>
                            </Setter.Value>
                        </Setter>
                        <Style.Triggers>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Trigger.EnterActions>
                                    <BeginStoryboard>
                                        <Storyboard>
                                            <BooleanAnimationUsingKeyFrames BeginTime="00:00:00.08"  Storyboard.TargetProperty="(ListBoxItem.IsSelected)">
                                                <DiscreteBooleanKeyFrame KeyTime="00:00:00" Value="True"/>
                                            </BooleanAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </BeginStoryboard>
                                </Trigger.EnterActions>
                                <Trigger.ExitActions>
                                    <BeginStoryboard>
                                        <Storyboard>
                                            <BooleanAnimationUsingKeyFrames BeginTime="00:00:00"  Storyboard.TargetProperty="(ListBoxItem.IsSelected)">
                                                <DiscreteBooleanKeyFrame KeyTime="00:00:00" Value="False"/>
                                            </BooleanAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </BeginStoryboard>
                                </Trigger.ExitActions>
                            </Trigger>
                        </Style.Triggers>
                    </Style>
                </Controls:AdorningListBox.ItemContainerStyle>
            </Controls:AdorningListBox>
        </Controls:AnimatedScrollDecorator>
    </Grid>
</UserControl>
